<template>
    <div style="padding:25px;">
     <el-button type="primary" @click="handleOpenDialog">弹窗测试</el-button>
     <test-dialog @addSucess="addSucess" ref="testdialog"></test-dialog>
     <el-button @click="handlSubmit">login</el-button>
    </div>

</template>

<script>
    import testDialog from '@/components/dialog/testDialog'
    import {Login} from '@/api/test.js'  // 接口
    export default{
        components:{
            testDialog,
        },
        data(){
            return{

            }
        },
        methods:{
            //关于弹窗配置  首先写一个业务弹窗组件放入dialog文件夹  如test-dialog  然后创建的每一个业务弹窗组件引入基本弹窗组件baseDialog
            //在你的业务弹窗组件里面  必须配置四个方法
            // 1.cancleAdd
            //2.confirmAdd(){ this.$emit("addSucess")}
            // 3.open(){ this.$refs.dialog.open();}
            // 4.close(){ this.$refs.dialog.close();}
            //页面调用弹窗组件   this.$refs.testdialog.open() 打开  this.$refs.testdialog.close()关闭
            //addSucess 此方法是所有弹窗确定之后触发的事件
            handleOpenDialog(){
               this.$refs.testdialog.open()
            },
            addSucess(){
                alert('提交成功')
            },
            handlSubmit(){
                Login({userId:'AAA',userPwd:'e10adc3949ba59abbe56e057f20f883e'})
            }
        }
    }
</script>
